<%@page import="java.util.Random"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" errorPage="500.jsp"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>电影</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/showfilm.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/common.css">
    <!-- 小图标 -->
  	<link rel="icon" href="css/favicon.ico" type="image/x-icon" />
    <script src="js/jquery-1.12.4.js"></script>
</head>
<body>
	<!-- 头部 -->
	<div class="header">
    	<div class="header-inner">
	      	<h1>
	        	<a href="index.html" class="logo">太平洋影城</a>
	      	</h1>
      		<div class="nav">
	        	<ul class="navbar">
		          	<li>
		            	<a href="index">首页</a>
		          	</li>
	          		<li>
	            		<a href="hotFilm.do"  class="active">电影</a>
	          		</li>
	          		<li>
	            		<a href="javascript:void(0)">影院</a>
	          		</li>
	          		<li>
	            		<a href="javascript:void(0)">演出</a>
	          		</li>
		          	<li>
		            	<a href="billboard.do">榜单</a>
		          	</li>
	          		<li>
	            		<a href="javascript:void(0)">热点</a>
	          		</li>
	          		<li>
	            		<a href="javascript:void(0)">商城</a>
	          		</li>
	        	</ul>
      		</div>
      		<div class="user-info">
        		<div class="user-avatar J-login">
	          		<c:choose>
	       				<c:when test="${sessionScope.userLogin !=null}">
	         				<img src="${sessionScope.userLogin.uImg}">
	       				</c:when>
	       				<c:otherwise>
	         				<img src="img/top_img/default_head.png">
	       				</c:otherwise>
	     			</c:choose>
	     			<span class="caret"></span>
	     			<c:choose>
	       				<c:when test="${sessionScope.userLogin !=null}">
	         				<ul class="user-menu yes-login-menu">
					           	<li class="text">
					             	<a href="order.do?uid=${sessionScope.userLogin.uId}">我的订单</a>
					           	</li>
					           	<li class="text login-name" >
					             	<a href="userEssential.do?uId=${sessionScope.userLogin.uId}">基本信息</a>
					           	</li>
					           	<li class="text">
					             	<a href="exit.do" class="J-logout">退出登录</a>
					           	</li>
	         				</ul>
	       				</c:when>
				       	<c:otherwise>
				         	<ul class="user-menu no-login-menu">
					           	<li>
					           		<a href="login.jsp">登录</a>
					           	</li>
				         	</ul>
				       	</c:otherwise>
	     			</c:choose>
      			</div>
    		</div>
		    <form action="searchFilm.do" method="post"  class="search-form">
		      	<input name="kw" class="search" type="search" maxlength="32" placeholder="找影视剧、影人、影院">
		      	<input class="submit" type="submit" value="">
		    </form>
    		<div class="app-download">
		      	<a href="#">
		        	<span class="iphone-icon"></span>
		        	<span class="apptext">APP下载</span>
		        	<span class="caret"></span>
		        	<div class="download-icon">
		          		<p class="down-title">扫码下载APP</p>
		          		<p class="down-content">选座更优惠</p>
		        	</div>
		      	</a>
    		</div>
  		</div>
	</div>
    <div class="header-placeholder"></div>
    <div class="subnav">
        <ul class="navbar">
          <li>
            <a flage="0" class="${param.flage == 0? 'active' : ''}"  href="hotFilm.do">正在热映</a>
          </li>
          <li>
            <a flage="1" class="${param.flage == 1? 'active' : ''}" href="showFilm.do" >即将上映</a>
          </li>
          <li>
            <a flage="2" class="${param.flage == 2? 'active' : ''}" href="selectAll.do">全部影片</a>
          </li>
        </ul>
      </div>
    <div class="container">
        <div class="movies-channel">
            <div class="tags-panel">
                <ul class="tags-lines">
                  <li class="tags-line">
                    <div class="tags-title">类型 :</div>
                    <ul class="tags" id="types">
                      <li flag1="-1" class="${param.flag1 == -1?'active':''} ">
                        <a href="javascript:void(0);" style="cursor: default">全部</a>
                      </li>
                      <c:set value = "0" var="sum"></c:set>
                      <c:forEach items="${sessionScope.types}"  var ="type" varStatus="sm">
                 
                      	 <li flag1="${sm.index}" class="${ (sm.index)== param.flag1?'active':''}">
                      		  <a href="javascript:void(0);">${type.typeName}</a>
                     	 </li> 
                      </c:forEach>
                    </ul>
                  </li>
                  <li class="tags-line tags-line-border">
                    <div class="tags-title">区域 :</div>
                    <ul class="tags" id="area">
                      <li flag2="-1"  class="${param.flag2 == -1?'active':''}">
                        <a href="javascript:void(0);" style="cursor: default">全部</a>
                      </li>
                       <c:forEach items="${sessionScope.places}" var="place" step="1" varStatus="sm">
                       		 <li flag2="${sm.index}" class="${ (sm.index)== param.flag2?'active':''}">
                       			<a href="javascript:void(0);">${place}</a>
                      		</li> 
                       </c:forEach> 
                      
                    </ul>
                  </li>
                  <li class="tags-line tags-line-border">
                    <div class="tags-title">年代 :</div>
                    <ul class="tags" id="years">
                      <li flag3="-1"  class="${param.flag3 == -1?'active':''}" >
                        <a href="javascript:void(0);" style="cursor: default">全部</a>
                      </li>
                      
                      <c:forEach items="${sessionScope.filmShowTimes}" var ="filmShowTime" varStatus="temp">
                      		<li flag3="${temp.count }" class="${param.flag3 == temp.count ? 'active':''} ">
                       			 <a href="javascript:void(0);" >${filmShowTime}</a>
                      		</li>
                      </c:forEach>
                    <%--   <li flag3="0" class="${param.flag3 == 0?'active':''} ">
                        <a href="javascript:void(0);" >2021</a>
                      </li>
                      <li flag3 = "1" class="${param.flag3 == 1?'active':''} " >
                        <a href="javascript:void(0);" >2020</a>
                      </li> --%>
                    </ul>
                  </li>
                </ul>
              </div>
            <div class="movies-panel">
              <div class="movies-sorter">
                <div class="cat-sorter">
                  <ul>
                    <li>
                      <span class="sort-control-group" >
                        <span flag4="-1" class="sort-control sort-radio ${param.flag4 == -1? 'sort-radio-checked' : ''}"></span>
                        <span class="sort-control-label">按热门排序</span>
                      </span>
                    </li>
                    <li>
                      <span class="sort-control-group">
                        <span flag4="0" class="sort-control sort-radio ${param.flag4 == 0? 'sort-radio-checked' : ''}"></span>
                        <span class="sort-control-label">按时间排序</span>
                      </span>
                    </li>
                    <li>
                      <span class="sort-control-group">
                        <span flag4="1" class="sort-control sort-radio ${param.flag4 == 1? 'sort-radio-checked' : ''}"></span>
                        <span class="sort-control-label">按评价排序</span>
                      </span>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="movies-list">
                <dl class="movie-list">
                <c:forEach items="${sessionScope.films}" begin="0" end="17" var="film" step="1">
				  	<dd>
	                    <div class="movie-item film-channel">
	                      <a href="javascript:void(0);">
	                        <div class="movie-poster">
	                          <img alt="${film.filmName}海报封面" src="${film.filmImg}">
	                        </div>
	                      </a>
	                    <div class="movie-item-hover">
	                      <a href="selectOneFilm.do?filmId=${film.filmId}">
	                        <img class="movie-hover-img" src="${film.filmImg}" alt="${film.filmName}">
	                        <div class="movie-hover-info">
	                          <div class="movie-hover-title" title="${film.filmName}">
	                            <span class="name ">${film.filmName}</span>
	                              <span class="score channel-detail-orange">
	                                <c:if test="${film.reviewScore ==null}">
			       				 		<i class="fraction" style="font-size: 15px;">暂无评分</i>
			       				 	</c:if>
			          				<c:if test="${film.reviewScore != null}">
			          				 	<i class="integer">${fn:substring(film.reviewScore,0,1)}.</i>
				                    	<i class="fraction">${fn:substring(film.reviewScore,2,3)}</i>
			          				</c:if> 
	                              </span>
	                          </div>
	                          <div class="movie-hover-title" title="${film.filmName}">
	                            <span class="hover-tag">类型:</span>
	                            <c:forEach items="${film.filmTypes}" var="type" step="1">
	                            	${type.typeName}
	                            </c:forEach>
	                          </div>
	                          <div class="movie-hover-title" title="${film.filmName}">
	                            <span class="hover-tag">主演:</span>
	                            <c:forEach items="${film.performers}" var="performer" step="1">
	                            	${performer.perName}
	                            </c:forEach>
	                          </div>
	                          <div class="movie-hover-title movie-hover-brief" title="${film.filmName}">
	                            <span class="hover-tag">上映时间:</span>
	                            ${film.filmShowTime}
	                          </div>
	                        </div>
	                      </a>
	                    </div>
	                  </div>
	                  <div class="channel-detail movie-item-title" title="${film.filmName}">
	                    <a href="selectOneFilm.do?filmId=${film.filmId}">${film.filmName}</a>
	                  </div>
	                  <div class="channel-detail channel-detail-orange">
	                    <c:if test="${film.reviewScore ==null}">
       				 		<i class="fraction" style="font-size: 17px;">暂无评分</i>
       				 	</c:if>
          				<c:if test="${film.reviewScore != null}">
          				 	<i class="integer">${fn:substring(film.reviewScore,0,1)}.</i>
	                    	<i class="fraction">${fn:substring(film.reviewScore,2,3)}</i>
          				</c:if> 
	                  </div>
                  </dd>          	
                </c:forEach>
                </dl>
                <c:if test="${fn:length(sessionScope.films) == 0}">
                	<% 
	                	Random random = new Random();
	            		int num2 = random.nextInt(10);
	            		int num1 = num2 - 5;
	            		if(num1 < 0) {
	            			num1 = 0;
	            		}
	            		int[] ranArr = new int[2];
	            		ranArr[0] = num1;
	            		ranArr[1] = num2;
	            		request.setAttribute("ranArr", ranArr);
                	%>
                	<div class="no-movies">
					 	 抱歉，没有找到相关结果，请尝试用其他条件筛选。
					</div>
					<div class="recommend-movies">
  						<h2>猜你喜欢</h2>
  						<dl class="movie-list">
  							<c:forEach items="${sessionScope.allFilmList}" begin="${requestScope.ranArr[0]}" end="${requestScope.ranArr[1]}" var="film">
	  							<dd>
				                    <div class="movie-item film-channel">
				                      <a href="javascript:void(0);">
				                        <div class="movie-poster">
				                          <img alt="${film.filmName}海报封面" src="${film.filmImg}">
				                        </div>
				                      </a>
				                    <div class="movie-item-hover">
				                      <a href="selectOneFilm.do?filmId=${film.filmId}">
				                        <img class="movie-hover-img" src="${film.filmImg}" alt="${film.filmName}">
				                        <div class="movie-hover-info">
				                          <div class="movie-hover-title" title="${film.filmName}">
				                            <span class="name ">${film.filmName}</span>
				                              <span class="score channel-detail-orange">
				                                <c:if test="${film.reviewScore ==null}">
						       				 		<i class="fraction" style="font-size: 15px;">暂无评分</i>
						       				 	</c:if>
						          				<c:if test="${film.reviewScore != null}">
						          				 	<i class="integer">${fn:substring(film.reviewScore,0,1)}.</i>
							                    	<i class="fraction">${fn:substring(film.reviewScore,2,3)}</i>
						          				</c:if> 
				                              </span>
				                          </div>
				                          <div class="movie-hover-title" title="${film.filmName}">
				                            <span class="hover-tag">类型:</span>
				                            <c:forEach items="${film.filmTypes}" var="type" step="1">
				                            	${type.typeName}
				                            </c:forEach>
				                          </div>
				                          <div class="movie-hover-title" title="${film.filmName}">
				                            <span class="hover-tag">主演:</span>
				                            <c:forEach items="${film.performers}" var="performer" step="1">
				                            	${performer.perName}
				                            </c:forEach>
				                          </div>
				                          <div class="movie-hover-title movie-hover-brief" title="${film.filmName}">
				                            <span class="hover-tag">上映时间:</span>
				                            ${film.filmShowTime}
				                          </div>
				                        </div>
				                      </a>
				                    </div>
				                  </div>
				                  <div class="channel-detail movie-item-title" title="${film.filmName}">
				                    <a href="selectOneFilm.do?filmId=${film.filmId}">${film.filmName}</a>
				                  </div>
				                  <div class="channel-detail channel-detail-orange">
				                    <c:if test="${film.reviewScore ==null}">
			       				 		<i class="fraction" style="font-size: 17px;">暂无评分</i>
			       				 	</c:if>
			          				<c:if test="${film.reviewScore != null}">
			          				 	<i class="integer">${fn:substring(film.reviewScore,0,1)}.</i>
				                    	<i class="fraction">${fn:substring(film.reviewScore,2,3)}</i>
			          				</c:if> 
				                  </div>
			                  </dd>
  							</c:forEach>
  						</dl>
					</div>
                </c:if>
                
                
                 <!--分页-->
			    <div id="fenye" class="panel-footer" style="text-align: center; display: block;">
			        <nav style="height: 35px;">
			            <ul class="pagination" style="margin-top:0px;">
			            	<c:if test="${fn:length(sessionScope.films) != 0}">
				                <li id="Previous" class="disabled" style="cursor: pointer;" flag="">
				                      <span aria-hidden="true">«</span>    
				                </li>
							</c:if>
			              
			                <c:forEach items="${sessionScope.film}"  begin="0" end="${sessionScope.filmSize<=18?0:(sessionScope.filmSize/18)}" varStatus="temp">
			                	   <li flag="${temp.count}" class="${param.flag == temp.count?'active':'' } data"><a href="javascript:void(0)">${temp.count }</a></li>
			                </c:forEach>
			                
			                <c:if test="${fn:length(sessionScope.films) != 0}">
				                <li id="li" style="cursor: pointer;">             
				                      <span aria-hidden="true">»</span>
				                </li>
			                </c:if>
			            </ul>
			        </nav>
			        <div class="clearfix"></div>
			    </div>
              </div>
            </div>
        </div>
    </div>
<!-- 底部 -->
	<div class="footer">
    	<div class="content">
      		<div class="moduleBox">
        		<div class="informationBox">
          			<div class="copy_van">
            			<a class="ycgg" href="">
            				<span>影城公告</span>
            			</a>
            			<ul>
              				<li>影城公告</li>
            			</ul>
          			</div>
          			<div class="copy_van">
            			<a class="ycgg" href="">
            				<span>会员中心</span>
            			</a>
			            <ul>
			              	<li>加入会员</li>
			              	<li>会员活动</li>
			              	<li>会员优惠</li>
			            </ul>
          			</div>
          			<div class="copy_van">
            			<a class="ycgg" href="">
            				<span>影片资讯</span>
            			</a>
			            <ul>
			              	<li>正在热映</li>
			              	<li>即将上映</li>
			            </ul>
          			</div>
		          	<div class="copy_van">
		            	<a class="ycgg" href="">
		            		<span>影城活动</span>
		            	</a>
		            	<ul>
		              		<li>影城活动</li>
		              		<li>电影资讯</li>
		            	</ul>
		          	</div>
		          	<div class="copy_van">
		            	<a class="ycgg" href="">
		            		<span>关于我们</span>
		            	</a>
			            <ul>
			              	<li>影城介绍</li>
			              	<li>影院介绍</li>
			              	<li>联系我们</li>
			            </ul>
		          	</div>
        		</div>
        		<div class="abc">
          			<div class="textFloat">
            			<div class="erwei1">
                        	<span class="spans ">
                               	<img class="img1" src="img/foot_img/wxerweima.png" alt="">
                            </span>
              				<span class="spans spanss">
                            	<a href="">微信在线购票</a>
                            </span>
            			</div>
            			<div class="erwei2">
                            <span class="spans">
                        		<img class="img1" src="img/foot_img/xcx.jpg" alt="">
                            </span>
              				<span class="spans spanss">
                                <a href="">小程序在线购票</a>
                            </span>
            			</div>
          			</div>
        		</div>
        		<div class="right_information">
		          	<ul class="ul1">
		            	<li class="lis1">连锁热线：</li>
		            	<li class="lis2">400-850-3366</li>
		          	</ul>
		          	<ul class="ul1">
		            	<li class="lis3">官方微信：</li>
		            	<li class="lis4">搜索“猫眼电影”</li>
		          	</ul>
        		</div>
		        <div class="top_btn">
                    <span>
                       	<a href="javascript:void(0)" id="top">TOP</a>
                    </span>
		        </div>
      		</div>
	      	<div class="foot_text">
	       		<div class="foot"> 版权所有(C)猫眼电影投资有限公司　　技术支持：3-1-501</div>
      		</div>
    	</div>
  	</div>
</body>
<script src="js/common.js"></script>
<script src = "js/showFilm.js"></script>
</html>